<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="text" placeholder="请输入数字1" id="in1"><br>
<input type="text" placeholder="请输入数字2" id="in2"><br>

<input type="button" value="加" onclick="calc('+')">
<input type="button" value="减" onclick="calc('-')">
<input type="button" value="乘" onclick="calc('*')">
<input type="button" value="除" onclick="calc('/')"><br>
<h1>结果:<span></span></h1>

<script>
  function calc(f){
    console.log('符号是',f)
    let in1_val = document.getElementById('in1');
      let in2_val=document.getElementById('in2');
      in1 = parseFloat(in1_val.value);
      in2 = parseFloat(in2_val.value);
      if (isNaN(in1) || isNaN(in2)){
          alert('请输入数字内容');
      }

      spaEle = document.querySelector("span")

   switch (f){
          case '+':
              spaEle.innerHTML = in1+in2;
              break;
       case '-':
           spanEle.innerHTML = in1 - in2;
           break;
       case '*':
           spanEle.innerHTML = in1 * in2;
           break;
       case '/':
           if(in2_val.value != 0){
               spanEle.innerHTML = in1 / in2;
           }else{
               alert('除数不能为0');
           }
           break;
   }
  }


</script>
</body>
</html>